{% load dajaxice_templatetags %}
<html>
	<head>
		<title>Dionysus</title>
		<link href="{{ MEDIA_URL }}css/style.css" rel="stylesheet" type="text/css" media="all"/>
		<link href="{{ MEDIA_URL }}css/sunny/jquery.css" rel="stylesheet" type="text/css" media="all"/>
		<script type="text/javascript" src="{{ MEDIA_URL }}jQuery/jquery.js" charset="utf-8"></script>
		<script type="text/javascript" src="{{ MEDIA_URL }}jQuery/jquery.ui.min.js" charset="utf-8"></script>
		<!-- dajaxice import -->
		{% dajaxice_js_import %}
		<!-- timeout -->
		<script type="text/javascript" src="{{ MEDIA_URL }}jQuery/jquery.timers.js" charset="utf-8"></script>
		<script type="text/javascript" src="{{ MEDIA_URL }}timeout.js" charset="utf-8"></script>
		{% block extra_js %}{% endblock %}
	</head>
	
	<body>
		<!-- this is the unified top bar -->
		<div id="topBar">
		{% if user.is_authenticated %}
			<span class="TopBarSpan"><b>Welcome, {{ user.username }}</b> &nbsp; |&nbsp; <a href="/account/logout/">Logout</a> &nbsp;</span>
		{% else %}
			<span class="TopBarSpan">&nbsp; <a href="/account/login/">Login</a> &nbsp;</span>
		{% endif %} 
		</div>
		<!-- this is the content of the page -->
		<div id="centered">
		<h1 class="title">{% block head_title %}{% endblock %}</h1>
		{% block body %}{% endblock %}
		</div>
		<div id="footer">
			<br/>
			<p> &copy; 2011 Eugeniu Costetchi</p>
			<p>All rights reserved</p>
		</div>
		
			<!-- timeout dialog window markup -->
		<div id="timeout-dialog" title="... getting unpatient">
			<p><span class="ui-icon ui-icon-alert"></span>
			I'll turn my back in <span id="dialog-countdown" style="font-weight:bold"></span> seconds.
			</p>
			<p>Are you going to talk to me?</p>
		</div>
	</body>
</html>